<template>
    <view :style="'height: ' + placeHolderHeight + 'px;'">
        <view class="header" :style="'height: ' + barHeight + 'px; padding-top: ' + bartops + 'px'">
            <view class="align-baselinebox" @tap="goback">
                <view class="container">
                    <image v-if="gohide != true" class="goback" src="/static/images/righticon.png"></image>
                </view>
                <view>
                    <text class="headline" v-if="gohide != true" :style="'line-height:' + barHeight + 'px;'">{{ headername }}</text>
                </view>
            </view>

            <text class="headlinehome" v-if="gohide == true" :style="'line-height:' + barHeight + 'px;'">{{ headername }}</text>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {};
    },
    props: {
        bartops: '',
        placeHolderHeight: '',
        barHeight: '',
        headername: '',
        gohide: ''
    },
    methods: {
        goback() {
            this.$emit('childFun'); //如果需要传递参数，直接写在triggerEvent的参数里即可
        }
    }
};
</script>
<style>
.header {
    display: flex;
    align-items: center;
    /* background-color: #fff; */
    background-color: rgba(255, 255, 255, 1);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99999;
}
.align-baselinebox {
    display: flex;
    align-items: center;
}
.container {
    display: flex;
}
.goback {
    width: 22rpx;
    height: 38rpx;
    margin-left: 20rpx;
    margin-right: 11rpx;
}

.headline {
    font-size: 36rpx;
    font-family: Source Han Sans CN;
    font-weight: 500;
    color: #333333;
}

.shop {
    height: 100%;
    width: 100%;

    background: #fbfbfb;
    /* position: relative;
  top: -40rpx; */
}

.headlinehome {
    margin-left: 39rpx;
    font-size: 32rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    color: #333333;
    /*固定宽度*/

    width: 320rpx;

    /*超出部分隐藏*/

    overflow: hidden;

    /*不换行*/

    white-space: nowrap;

    /*添加...*/

    text-overflow: ellipsis;
}
</style>
